<template>
  <div class="form-layout">
    <!--左侧导航-->
    <div class="nav-left">
      <customAnchor :itemList="[{ name: 'box-base', title: '基础信息' },{ name: 'box-content', title: '安全库存配置' }]" />
    </div>
    <!--表单区域-->
    <div class="form-right" ref="formRight">
      <customForm :data="form" :rules="propRules" ref="editForm" :disabled="propReadonly">
        <template #content>
          <div id="box-base" class="box-title">基础信息</div>
          <customFormItem
            label="仓库名称"
            name="warehouseName"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.staticHtml.name"
            :config="{value: form.warehouseName}"
            fullWidth
          />
          <customFormItem
            label="商品名称"
            name="matrName"
            :parent="_self"
            :form="form"
            :readonly="true"
            :showSelectIcon="true"
            @focus="utilSelect.matr(selectChange)"
          />
          <customFormItem
            label="要求单位"
            name="requiredUnit"
            :parent="_self"
            :form="form"
            :readonly="true"
            :showSelectIcon="true"
            @focus="utilSelect.matrUnit(selectChange, form.matrId ? form.matrId : -1, 1)"
          />
          <customFormItem label="商品规格" name="matrSpec" :parent="_self" :form="form" :type="constCommon.formItemType.staticHtml.name"
                          :config="{value: form.matrSpec}"/>
          <customFormItem label="单品单位" name="skuUnit" :parent="_self" :form="form"  :type="constCommon.formItemType.staticHtml.name"
                          :config="{value: form.skuUnit}" />
          <customFormItem
            label="包装比率"
            name="requiredRate"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.staticHtml.name"
            :config="{value: form.requiredRate}"
          />
          <div id="box-content" class="box-title">安全库存配置</div>
          <customFormItem
            label="安全库存"
            name="skuQtySafety"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.inputNumber.name"
          />
          <customFormItem
            label="最佳库存"
            name="skuQtyPerfect"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.inputNumber.name"
            :config="{ min: 1 }"
          />
          <customFormItem
            label="日消耗量"
            name="skuQtyDaily"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.inputNumber.name"
          />
          <customFormItem
            label="自动请领"
            name="flagAutoJob"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.switch.name"
          />
          <customFormItem
            label="执行周期"
            name="jobPeriod"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.selectStatic.name"
            :config="{ options: utils.getDictDataList('common_period') }"
          />
          <customFormItem
            label="送货周期"
            name="deliverPeriod"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.selectStatic.name"
            :config="{ options: utils.getDictDataList('common_period') }"
          />
        </template>
      </customForm>
    </div>
  </div>
</template>

<script>
import customAnchor from '@/components/custom/form/customAnchor.vue'

export default {
  data() {
    return {
      form: {},
      viewData: {},
    }
  },
  methods: {
    //下拉列表选择后
    selectChange(row, refName) {
      if (refName == 'tableDrawerMatr') {
        console.log('row', row)
        //品名
        let { matrId, name, spec, skuUnit, skuPrice } = row
        this.$set(this.form, 'matrId', matrId)
        this.$set(this.form, 'matrName', name)
        this.$set(this.form, 'matrSpec', spec)
        this.$set(this.form, 'skuUnit', skuUnit)
        this.$set(this.form, 'skuPrice', skuPrice)
        this.$set(this.form, 'requiredUnit', skuUnit)
        this.$set(this.form, 'requiredRate', 1)
      }
      if (refName == 'tableDrawerUnit') {
        //选择完单位
        this.$set(this.form, 'requiredUnit', row.requiredUnit)
        this.$set(this.form, 'requiredRate', row.packageRate)
      }
    },
  },
  created() {
    this.$emit('event-register', {
      validate: (callback) => {
        return this.$refs.editForm.validate(callback)
      },
      beforeSave: () => {
        if (this.form.skuQtyPerfect < this.form.skuQtySafety) {
          this.utilMessage.error('最佳库存不能小于安全库存')
          return false
        }
        if (!this.form.requiredUnit) {
          this.$set(this.form, 'requiredUnit', this.form.skuUnit)
        }
        this.$emit('data-callback', this.form)
        return true
      },
      afterMove: (formData) => {
        this.form = global.utils.jsonClone(formData)
        this.$set(this.form, 'flagAutoJob', this.form.flagAutoJob == undefined ? true : this.form.flagAutoJob)
        if (!formData.id) {
          this.$set(this.form, 'warehouseId', this.propInitData.id)
          this.$set(this.form, 'warehouseName', this.propInitData.label)
          this.$set(this.form, 'jobPeriod', '0')
        }
      },
      afterSave: () => {},
      beforeDelete: () => {
        return true
      },
      afterDelete: () => {},
      beforeFlow: () => {
        return true
      },
      afterFlow: () => {},
      beforeClose: () => {
        return true
      },
    })
  },
  props: {
    propParent: Object,
    propInitData: Object,
    propPrimaryKey: String,
    propDictionaries: Object,
    propCurrentRow: Object,
    propViewFormData: Object,
    propReadonly: Boolean,
    propStatus: String,
    propRules: Object,
  },
  components: {
    customAnchor
  },
  computed: {},
}
</script>
